import { Image as OriginalImage } from "element-tiptap";
import CustomMenuButton from './MenuButton.vue'

export default class Image extends OriginalImage {
    constructor(option = {}) {
        super(option)
    }
    menuBtnView(editorContext) {
        return {
            component: CustomMenuButton,
            componentProps: {
                isActive: editorContext.isActive.image()
            },
            componentEvents: {
                click(level) {
                    let input = document.createElement('input')
                    input.type = 'file'
                    input.click()
                    input.onchange = function (e) {
                        let fr = new FileReader()
                        fr.onload = function (e) {
                            editorContext.commands.image({ src: e.target.result })
                        }
                        fr.readAsDataURL(e.target.files[0])
                    }
                }
            }
        };
    }
}